<template>
  <div>
    <div
      v-for="(itemFa, index) in $parent.dataAllinfo"
      :key="index"
      class="bigBox"
    >
      <!-- 图片 -->
      <div class="contetn_title">
        <img :src="itemFa.headUrl" alt="" />
      </div>

      <van-grid :border="true" :column-num="2" :center="false">
        <van-grid-item
          class="content_box"
          v-for="(item, index) in itemFa.list"
          :key="index"
        >
          <p class="font1">{{ item.title }}</p>
          <p class="font2">{{ item.desc }}</p>
          <div class="contentImg">
            <img
              v-for="(itemImg, index) in item.products"
              :key="index"
              v-lazy="itemImg.imgUrl"
              alt=""
            />
          </div>
        </van-grid-item>
      </van-grid>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.bigBox {
  padding-bottom: 50px;
}
.content_box {
  width: 207px;
  height: 149px;
  border-width: 20px;
  border-color: #dcdcdc;

  .font1 {
    width: 100%;
    height: 24px;
    font-size: 18px;
    text-align: left;
  }
  .font2 {
    width: 100%;
    height: 30px;
    font-size: 14px;
    color: #f63515;
    line-height: 30px;
    text-align: left;
  }

  .contentImg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;

    img {
      width: 71px;
      height: 71px;
    }
  }
}
.contetn_title {
  width: 100%;
  height: 44px;
  background-color: #f6f6f6;
  img {
    width: 100%;
    height: 44px;
  }
}
</style>
